.page {
	min-height: 100vh;
	width: 100%;
	background-color: #f4f4f4;
	.top {
		background-color: #FA3F3F;
		background-image: url(~@/static/images/bg/tgbg.jpg);
		height: 904upx ;
		background-size: cover;
		.active{
			background-color: #fff;
			color: #333;
		
		}
		.main {
			text-align: center;
			.tit {
				font-size: 28upx;
				color: #fff;
				padding-top: 60upx;
			}
			.code{
				padding-top: 20upx
			}
			view {
				image {
					margin-top: 36upx;
					width: 254upx;
					height: 254upx;
				}
			}
			.lianjie {
				width: 560upx;
				margin: 0 auto;
				height: 68upx;
				padding: 0 20upx;
				background-color: #ffffff;
				border-radius: 10upx;
				display: flex;
				flex-direction: row;
				align-items: center;
				margin-top: 40upx;
				text {
					font-size: 28upx;
					width: 140upx;
					text-align: center;
				}
				input {
					width: 544upx;
					text-align: left;
					color: #333;
					font-size: 28upx;
				}
			}
			.copy {
				width: 186upx;
				height: 68upx;
				line-height: 68upx;
				border-radius: 10upx;
				color: #fff;
				font-size: 28upx;
				border: solid 4upx #ff9f9f;
				margin: 0 auto;
				margin-top: 40upx;
			}
		}
	}
	.main1 {
		width: 590upx;
		margin-top: -110upx;
		// height: 334upx;
		background-color: #ffffff;
		border-radius: 10upx;
		margin-left: 40upx;
		padding: 40upx;
		.tit1 {
			font-size: 32upx;
			.people {
				display: inline-block;
				text-align: center;
				line-height: 44upx;
				padding: 0 6upx;
				// width: 204upx;
				height: 44upx;
				border-radius: 26upx;
				border: solid 2upx #afafaf;
				font-size: 26upx;
				margin-left: 20upx;
			}
		}
		.content {
			display: flex;
			flex-direction: row;
			justify-content: space-around;
			flex-wrap: wrap;
			padding-top: 30upx;
			.item {
				width: 238upx;
				height: 68upx;
				background-color: #f9f9f9;
				border-radius: 4upx;
				margin-top: 20upx;
				font-size: 26upx;
				display: flex;
				justify-content: space-between;
				flex-direction: row;
				align-items: center;
				padding: 0 20upx;
			}
		}
	}
	.list{
		width: 590upx;
		margin-top: 30upx;
	
		background-color: #ffffff;
		border-radius: 10upx;
		margin-left: 40upx;
		padding: 40upx;
		.listitem{
			display: flex;
			flex-direction: row;
			justify-content: space-between;
			align-items: center;
			font-size: 28upx;
			height: 80upx;
			border-bottom: 1px  solid #e4e4e4;
			
			.w1{
				width: 250upx;
			}
			.w2{
				width: 170upx;
				text-align: center;
			}
			.w3{
				width: 280upx;
				text-align: right;
			}
		}
		.th{
			color: #a2a1a1;
			
		}
		.td{
			
		}
	}
	.sharebox{
		.bottom-title {
			line-height: 60upx;
			font-size: 24upx;
			padding: 15upx 0;
		}
		
		.bottom-content {
			display: flex;
			flex-wrap: wrap;
			padding: 0 35upx;
		}
		
		.bottom-content-box {
			display: flex;
			flex-direction: column;
			align-items: center;
			margin-bottom: 15upx;
			width: 25%;
			box-sizing: border-box;
		}
		
		.bottom-content-image {
			display: flex;
			justify-content: center;
			align-items: center;
			overflow: hidden;
			image{
				width: 90upx;
				height: 90upx;
			}
		}
		
		.bottom-content-text {
			font-size: 26upx;
			color: #333;
			margin-top: 10upx;
		}
		
		.bottom-btn {
			height: 90upx;
			line-height: 90upx;
			border-top: 1px #f5f5f5 solid;
		}
		
		.bottom-content-image.wx {
			background: #00ce47;
		}
		
		.bottom-content-image.qq {
			background: #00b6f6;
		}
		
		.bottom-content-image.sina {
			background: #ff766a;
		}
		
		.bottom-content-image.copy {
			background: #07ccd0;
		}
	}
}
